
<!-- Main content -->
<section class="content">

    <div class="row">
        <!-- general form elements -->
        <div class="box box-primary">
            <!-- form start -->
            <div class="box-body">
                <div class="row">
                    <div class="col-md-3">
                            <span class="btn btn-success fileinput-button">
                                <i class="glyphicon glyphicon-plus"></i>
                                <span>添加图片</span>
                                <input id="fileupload" type="file" name="files[]" multiple>
                            </span>
                    </div>
                    <div class="col-md-9">
                        <div class="box-body" id="upimgs"><img src="" style="height:100px;display:none" class="up-img"></div>
                    </div>
                </div>
                <div class="row" style="margin-top:30px;">
                    <div class="col-md-3">
                        <label class="control-label" for="linkType">连接类型</label>
                    </div>
                    <div class="col-md-9">
                        <select class="form-control" id="linkType" name="linkType">
                            <option>外部链接</option>
                            <option data-val="categ">商品分类页</option>
                            <option data-val="art_id">文章分类页</option>
                            <option data-val="subpage">二级页</option>
                            <option data-val="SecKill">秒杀列表</option>
                        </select>
                    </div>
                </div>
                <div class="row" style="margin-top:15px;">
                    <div class="col-md-3">
                        <label class="control-label" for="link">图片链接</label>
                    </div>
                    <div class="col-md-9">
                        <input type="text" class="form-control" id="link" name="link" value="http://www.baidu.com" >
                    </div>
                </div>

                <div class="row dataArea"  style="margin-top:15px; display:none;"><!--选择数据-->

                </div>


            </div><!-- /.box -->
        </div><!--/.col (left) -->
    </div>

</section><!-- /.content -->

<script>
    //上传图片
    $('#fileupload').fileupload({
        url: '/upload',
        dataType: 'json',
        autoUpload: true,
        acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
        maxFileSize: 2000000, // 2 MB
        // Enable image resizing, except for Android and Opera,
        // which actually support image resizing, but fail to
        // send Blob objects via XHR requests:
        disableImageResize: /Android(?!.*Chrome)|Opera/
                .test(window.navigator.userAgent),
        previewMaxWidth: 610,
        previewMaxHeight: 610,
        previewCrop: true
    }).on('fileuploadadd', function (e, data) {
        //console.log("fileuploadadd",data);
    }).on('fileuploadprocessalways', function (e, data) {
        //console.log("fileuploadprocessalways",data);
    }).on('fileuploadprogressall', function (e, data) {
        //console.log("fileuploadprogressall",data);
    }).on('fileuploaddone', function (e, data) {
        var url=data._response.result.url;
        $(".up-img").attr("src",url);
        $(".up-img").show();
    }).on('fileuploadfail', function (e, data) {
        bootbox.alert("上传失败！", function() {});
    });

</script>